How to create a form in React?
React uses forms to allow users to interact with the web page. In React, form data is usually handled by the components. When the data is handled by the components, all the data is stored in the component state. You can control changes by adding event handlers in the onChange attribute and that event handler will be used to update the state of the variable....
read more
How to trigger events in JavaScript ?
Javascript is a high-level, interpreted, dynamically typed client-side scripting language. HTML is static and Javascript is used to add functionality to static HTML code. HTML events are handled by JavaScript. When an event occurs, it requires some action to be taken. This action can be accomplished through JavaScript event handlers. In addition to JavaScript, jQuery which is equivalent to JavaScript in terms of functionality can also be used to trigger events in an HTML document. In order to work on JavaScript trigger events, it is important to know what is an event. An event is an interaction between JavaScript and HTML. Some common HTML events are as follows:...
read more
How to save an image to localStorage and display it on the next page?
What is localStorage?...
read more
How to change the “checked” background color of toggle switch in Bootstrap 4?
Bootstrap is a popular choice among web developers for building interactive webpage designs. Bootstrap has come along a long way with multiple releases and enriched content with every new release. Bootstrap has a wide community that has also contributed newer packages that have made working with Bootstrap easier. In this article, we shall deal with changing the background color of the toggle switch in Bootstrap 4. Bootstrap 4 provides a custom-switch class by default which is used to create toggle switch and the custom-control-input class deals with the background color and border color of the switch. In Bootstrap 4, the background color of the toggle switch is blue. This color can be changed by manipulating the custom-control-input class. There is another method to change the color using external libraries with a wide range of color classes. We shall discuss both the methods in the examples below....
read more
How to make Drawer using Material UI ?
Material UI Drawer is the most widely used component of Material UI. Material UI Drawer is used as a navigation bar of the website which displays a list of items and then clicking on the item the user will be redirected to the specific part of the web page/website. It is seen in almost all the websites as they provide better user interaction and easy to navigate in between the different parts of the application....
read more
Design a Tip Calculator using HTML, CSS and JavaScript
The tip is the money given as a gift for good service, to the person who serves you in a restaurant. In this project, a simple tip calculator is made which takes the billing amount, type of service, and the number of persons as input. As per the three inputs, it generates a tip for the serving person. In this article, we are going to learn how to design a Tip Calculator using HTML, CSS, and JavaScript....
read more
How to make a video call app in node.js ?
For making a video call app, It is required that each and every client send their video and audio stream to all the other clients. So for this purpose we are using Peer.js and for the communication between the clients and the server we are using WebSocket i.e. Socket.io....
read more
Django Authentication Project with Firebase
Django is a Python-based web framework that allows you to quickly create efficient web applications.. When we are building any website, we will need a set of components: how to handle user authentication (signing up, signing in, signing out), a management panel for managing our website, how to upload files, etc. Django gives us ready-made components to use that easily....
read more
Node.js fs.rm() Method
The fs.rm() method is used to delete a file at the given path. It can also be used recursively to remove directories....
read more
How to reload page only once in JavaScript ?
Reloading a webpage once using JavaScript ensures that users see the most up-to-date content on their initial visit. This technique leverages session storage to track if the page has been reloaded, enhancing user experience by preventing unnecessary reloads and ensuring content freshness....
read more
Difference between npm install and npm update in Node.js
NPM is like a powerhouse for Node.js  that contains all the necessary modules for the smooth running of the node.js application. It gets installed on our machine when we install Node.js on our Windows, Linux or MAC OS....
read more
How to implement BarChart in ReactJS ?
In our React app sometimes we want to display a BarChart representation of a particular data. We can use react-chartjs-2 and chart.js module in ReactJS to display information in BarCharts format. Following are some simple steps to do so:...
read more